<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>咕哒猎人</title>
#parse("/WEB-INF/views_webapp/layout/css.html")
<style type="text/css">
#addMore{
	display: block;
	width: auto;
	height: 10rem;
	text-align: center;
	line-height: 10rem;
	border: 1px dashed #eee;
	margin: 0 0.5rem 0 0.5rem;
	background: #f5f5f5;
	border-radius: 4px;
}

</style>
</head>
<body>
	<div class="wrapper">
		<div id="foodbox">
			<div class="foodinfo">
				<img src="${base}/static/res/webapp/img/1.jpg" class="img" />
				<div class="foodtitle">
					好吃的零食-北田早迷香-200g
				</div>
				<div class="food_fee">
					<span class="ff-1">每周特惠</span>
					<span class="ff-2">￥300.00</span>
					<span class="ff-3">原价：500.00</span>
				</div>
			</div>
			
			<a id="addMore">
				再扫一扫
			</a>
			
		</div>
	</div>
	
	<div class="goumai">
		<div class="allfee">
			共需要支付：￥<span id="feecount">1000.00</span>
		</div>
		<a id="goumaibtn">立刻购买</a>
	</div>
#parse("/WEB-INF/views_webapp/layout/bottom.html")
<script id="item-tpl" type="text/html">
	<div class="foodinfo">
		<img src="${base}/static/res/webapp/img/1.jpg" class="img" />
		<div class="foodtitle">
			好吃的零食-北田早迷香-200g
		</div>
		<div class="food_fee">
			<span class="ff-1">每周特惠</span>
			<span class="ff-2">￥300.00</span>
			<span class="ff-3">原价：500.00</span>
		</div>
	</div>
</script>
<script type="text/javascript">
	$(function(){
		$("#addMore").click(function(){
			scan();
		});
		//购买
		$("#goumaibtn").click(function(){
			$.ui.mask("客官稍等……");
			//执行提交逻辑
			window.location.href="${base}/gd/pay";
		});
	});
	
	function scan(){
		wx.scanQRCode({
		    needResult:1,
		    scanType: ["qrCode"],
		    success: function (res) {
		    	var result = res.resultStr;
		    	//从服务器获取商品信息
		    	$.ui.mask("客官稍等……");
		    	//在页面中刚刚扫描的商品
		    	window.setTimeout(function(){
		    		var _tpl=template("item-tpl",{});
		    		document.getElementById("addMore").insertAdjacentHTML("beforeBegin", _tpl);
		    		//更新总价
		    		var nowCount=$("#feecount").html();
		    		$("#feecount").html(parseFloat(nowCount)+1000)
		    		$.ui.unmask();
		    	},1500);
			}
		});
	}
</script>
<!--如果是微信客户端，需要以下代码--->
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
wx.config({
    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
    appId: '${config.appId}', // 必填，公众号的唯一标识
    timestamp:'${config.timestamp}', // 必填，生成签名的时间戳
    nonceStr: '${config.nonceStr}', // 必填，生成签名的随机串
    signature: '${config.signature}',// 必填，签名，见附录1
    jsApiList: [
    	'scanQRCode'
    ] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
});	
wx.ready(function () {
	 WeixinJSBridge.call('hideOptionMenu');
});
</script>
</body>
</html>